<template>
	<div class="background">
		<a-card style="margin-bottom: 10px">
			<a-row>
				<a-col :span="24">
					<a-form layout="inline" :form="form" @submit="handleSubmit">
						<a-form-item>
							<a-select style="width: 180px" show-search placeholder="请选择上货季" v-model="operId" allow-clear
								@change="changePart">
								<a-select-option :value="item.name" v-for="(item, index) in partList">
									{{ item.name }}
								</a-select-option>
							</a-select>
						</a-form-item>
						<a-form-item>
							<a-select style="width: 180px" show-search placeholder="请选择品牌" v-model="brandw" labelInValue
								allow-clear @change="changeOper">
								<a-select-option :value="item.code" v-for="(item, index) in operList" :key="item.code"
									:title="item.name">
									{{ item.name }}
								</a-select-option>
							</a-select>
						</a-form-item>
						<a-form-item>
							<a-select style="width: 180px" show-search placeholder="请选择品类" v-model="operistd"
								labelInValue allow-clear @change="changeBrand">
								<a-select-option :value="item.code" v-for="(item, index) in brandList" :key="item.code"
									:title="item.name">
									{{ item.name }}
								</a-select-option>
							</a-select>
						</a-form-item>
						<a-form-item>
							<a-input placeholder="请选样衣号" v-model="samplecode"></a-input>
						</a-form-item>

						<a-form-item>
							<a-button type="primary" html-type="submit">搜索</a-button>
						</a-form-item>
					</a-form>
				</a-col>
			</a-row>
		</a-card>
		<a-card>
			<!-- <div @click="Designitem"> -->
			<a-table :loading="loading" :columns="columns" :data-source="list" :pagination="pagination"
				@change="handleTableChange"> </a-table>
			<!-- </div> -->
		</a-card>
	</div>
</template>

<script>
	import {
		getList
	} from '@api/spection/index'
	import {
		getDictChildList
	} from '@api/rd/index'
	const columns = [{
			title: '序号',
			dataIndex: '序号',
			key: '序号',
			align: 'center',
			customRender: (text, record, index) => {
				return index + 1
			}
		},
		{
			title: '单号',
			key: 'billno',
			dataIndex: 'billno',
			align: 'center'
		},
		{
			title: '样衣号',
			dataIndex: 'samplecode',
			key: 'samplecode',
			align: 'center'
		},
		{
			title: '品名',
			dataIndex: 'samplename',
			key: 'samplename',
			align: 'center'
		},
		{
			title: '流程节点',
			key: 'flagname',
			dataIndex: 'flagname',
			align: 'center'
		},
		{
			title: '版次',
			dataIndex: 'edition',
			key: 'edition',
			align: 'center'
		},
		{
			title: '品类',
			dataIndex: 'samplecat',
			key: 'samplecat',
			align: 'center'
		},
		{
			title: '设计师',
			dataIndex: 'designerName',
			key: 'designerName',
			align: 'center'
		},
		{
			title: '版师',
			dataIndex: 'sampleDesignName',
			key: 'sampleDesignName',
			align: 'center'
		},
		{
			title: '品牌',
			dataIndex: 'brand',
			key: 'brand',
			align: 'center'
		},
		{
			title: '波段',
			dataIndex: 'season',
			key: 'season',
			align: 'center'
		}
	]
	export default {
		data() {
			return {
				username: JSON.parse(localStorage.getItem('pro__Login_Userinfo')),
				list: [],
				partList: [],
				operList: [],
				form: this.$form.createForm(this),
				samplecat: '',
				brandList: [],
				scseason: '',
				operId: undefined,
				operistd: undefined,
				samplecode: '',
				brandw: undefined,
				columns,
				loading: false,
				pagination: {
					total: 0,
					current: 1,
					size: '10',
					pageSizeOptions: ['10', '20', '30', '40'],
					showQuickJumper: true,
					showSizeChanger: true,
					showTotal: total => `共 ${total} 条记录`,
					itemRender: (current, type, originalElement) => {
						if (type === 'prev') {
							return < a > 上一页 < /a>
						} else if (type === 'next') {
							return < a > 下一页 < /a>
						}
						return originalElement
					}
				}
			}
		},
		mounted() {
			this.loadData()
			this.getDictChildList()
			this.getDictChildLists()
			this.getDictChildLiss()
		},
		computed: {
			userInfo() {
				return this.$store.getters.userInfo || null
			}
		},
		methods: {
			handleTableChange(pagination) {
				this.pagination = pagination
				this.loadData()
			},

			changePart(values) {
				this.scseason = values.label
			},
			changeOper(values) {
				console.log(values)
				if (values != undefined) {
					this.brand = values.key
				} else {
					this.brand = undefined
				}

			},
			changeBrand(values) {
				console.log(values)
				if (values != undefined) {
					this.samplecat = values.key
				} else {
					this.samplecat = undefined
				}
			},
			handleSubmit(e) {
				e.preventDefault()
				this.loadData(1)
			},
			async loadData(key) {
				this.loading = true
				if (key) {
					this.pagination.current = 1
				}
				const params = {
					current: this.pagination.current,
					size: this.pagination.size
				}
				if (this.scseason) {
					params.scseason = this.scseason
				}
				if (this.brand) {
					params.brand = this.brand
				}
				if (this.samplecat) {
					params.samplecat = this.samplecat
				}
				if (this.samplecode) {
					params.samplecode = this.samplecode
				}
				params.username = this.username.value.phone
				params.jobNumber = this.username.value.workNo
				params.roleCodeList = this.username.value.roleCode
				try {
					const res = await getList(params)
					if (res.code == 200) {
						this.list = res.data.records
						this.pagination.total = res.data.total
					} else {
						if (res.msg) {
							this.$message.error(res.msg)
						} else {
							this.$message.error('获取待办列表失败！')
						}
					}
				} catch (error) {
					console.log(error)
				} finally {
					this.loading = false
				}
			},
			// 上货季
			async getDictChildList() {
				const params = {
					name: 'SEASON'
				}
				try {
					const res = await getDictChildList('dict', params)
					if (res.code == 200) {
						this.partList = res.data
					} else {
						if (res.msg) {
							this.$message.error(res.msg)
						} else {
							this.$message.error('获取上货季列表失败！')
						}
					}
				} catch (error) {
					console.log(error)
				}
			},
			// 品牌
			async getDictChildLists() {
				const params = {
					name: 'SMALL_BRAND'
				}
				try {
					const res = await getDictChildList('dict', params)
					if (res.code == 200) {
						this.operList = res.data
					} else {
						if (res.msg) {
							this.$message.error(res.msg)
						} else {
							this.$message.error('获取品牌列表失败！')
						}
					}
				} catch (error) {
					console.log(error)
				}
			},
			async getDictChildLiss() {
				const params = {
					name: 'CATEGORY'
				}
				try {
					const res = await getDictChildList('dict', params)
					if (res.code == 200) {
						this.brandList = res.data
					} else {
						if (res.msg) {
							this.$message.error(res.msg)
						} else {
							this.$message.error('获取品牌列表失败！')
						}
					}
				} catch (error) {
					console.log(error)
				}
			},

			// Designitem() {
			//   this.$router.push('/spection/index')
			// }
		}
	}
</script>
<style lang="less" scoped>
	.background {
		background: transparent;
	}

	.ant-modal-body {
		display: flex;
		justify-content: space-between;
	}
</style>